<template>
	<uni-nav-bar :title="title" left-icon="left" @clickLeft="navBack" :fixed="true" statusBar></uni-nav-bar>
	<view class="package_sale" style="font-size: 26rpx;" v-if="wareInfor">
		<view style="font-size: 30rpx;">{{wareInfor.name}}（ID:{{wareInfor.id}}）</view>
		<view style="margin:5rpx 0px;">负责人：{{wareInfor.admin_name}}</view>
		<view>{{wareInfor.address}}</view>
	</view>
	<!-- 切换 -->
	<view class="package_sale" style="padding:0px;">
		<z-tabs ref="tabs" :list="list" :current="current" @change="tabsChange" inactive-color="#333" />
	</view>
	<scroll-view scroll-y="true" enable-back-to-top @scrolltolower="loadMore" class="scroll-box"
		:style="{ height: pageHeight + 'px' }">
		<view class="package_sale space-between"
			@click="navTo('Sale/warehouse/shopDetail?shopID='+item.id+'&wareID='+wareID)"
			v-for="(item,index) in frinedList" :key="item.id" :style="{marginTop:index==0?'0px':'10rpx'}">
			<view style="width:85%;">{{item.name}}</view>
			<view>{{item.nums}}件</view>
		</view>
		<!-- 	<view class="package_sale space-between list" v-for="(item,index) in frinedList"
			:style="{marginTop:index==0?'0px':'15rpx'}"
			@click="navTo('Sale/warehouse/shopDetail?shopID='+item.id+'&wareID='+wareID)" style="padding:15rpx;">
			<image :src="item.image" mode=""></image>
			<image src="../../../static/mine/ls.png" mode=""></image>
			<view class="direction-start" style="height:180rpx;justify-content:space-between;width:72%;">
				<view class="title">{{item.name}}</view>
				<view style="font-size: 24rpx;">库存：{{item.nums}}</view>
				<view style="font-size: 24rpx;">配送费：10.23</view>
				<view class="space-between" style="width:100%;">
					<view style="font-size: 26rpx;"><text
							style="color:#FF1313;font-size: 32rpx;margin-right: 10rpx;">200</text>蓝宝石
					</view>
					<view style="font-size: 24rpx;">零售价：100.23</view>
				</view>
			</view>
		</view> -->
		<Popu v-if="frinedList.length<1" :pageHeight="pageHeight" text="暂无商品列表"></Popu>
	</scroll-view>
</template>

<script setup lang="ts">
	import { ref } from 'vue';
	import { navBack, navTo } from '@/utils/navigator';
	import { showLoading } from '@/utils/prompt';
	import { onLoad } from '@dcloudio/uni-app';
	import Popu from '@c/earthPushing/common/popu.vue';
	import { getKuInfo, getKuGoodsCate, getKuGoodsList } from '@/gql/earthPushing/warehouse';
	import { toPublish } from '@mqtt';
	const list = ref([])
	const current = ref(0)
	const title = ref()
	const wareID = ref()
	const wareInfor = ref()

	const pageHeight = ref();
	const frinedList = ref([])
	const lastPage = ref(1);
	const currentPage = ref(1);
	const listID = ref()
	uni.getSystemInfo({
		success: function (res) {
			pageHeight.value = res.windowHeight - 210;
		},
	});
	onLoad((pearm) => {
		wareID.value = Number(pearm.id)
		init()
		classList()
	})
	//获取仓库详情
	function init() {
		showLoading('正在加载');
		const payload = {
			query: getKuInfo,
			variables: {
				ku_id: wareID.value,
			},
		};
		toPublish('ql/control/getKuInfo', payload, (obj : any) => {
			uni.hideLoading();
			const { getKuInfo } = obj.data;
			wareInfor.value = getKuInfo;
			title.value = getKuInfo.name
		});
	}
	//获取仓库商品分类
	function classList() {
		showLoading('正在加载');
		const payload = {
			query: getKuGoodsCate,
			variables: {
				ku_id: wareID.value,
			},
		};
		toPublish('ql/control/getKuGoodsCate', payload, (obj : any) => {
			uni.hideLoading();
			const { getKuGoodsCate } = obj.data;
			list.value = getKuGoodsCate;
			listID.value = getKuGoodsCate && getKuGoodsCate[0].id
			wareList()
		});
	}
	/**
	 * 获取商品信息
	 * @param {Number} page  获取商品列表数据
	 * @param {String} keywords  搜索信息
	 */
	function wareList() {
		showLoading()
		const payload = {
			query: getKuGoodsList,
			variables: {
				page: currentPage.value,
				cid: Number(listID.value),
				ku_id: wareID.value,
			},
		};
		toPublish(
			'ql/control/getKuGoodsList',
			payload,
			(obj : any) => {
				const { getKuGoodsList } = obj.data;
				frinedList.value = [...frinedList.value, ...getKuGoodsList.list];
				lastPage.value = getKuGoodsList.lastpage;
			}
		);
	}
	/**
	 * 加载更多
	 */
	function loadMore() {
		if (currentPage.value < lastPage.value) {
			currentPage.value++;
			wareList();
		}
	}
	//tabs通知swiper切换
	function tabsChange(index : number) {
		current.value = index;
		listID.value = list.value[index].id
		currentPage.value = 1
		frinedList.value = []
		wareList();
	}
</script>

<style scoped lang="less">
	image {
		width: 180rpx;
		height: 180rpx;
		background: #C4C4C4;
		border-radius: 5px;
	}

	.title {
		width: 100%;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
</style>